<template>
  <view>
    <up-cell
      title="昵称"
      is-link
      :value="user.username"
      @click="toEdit('username', '昵称', user.username, '请输入新昵称')"
    ></up-cell>
    <up-cell title="账号" :value="user.userAccount"></up-cell>
    <up-cell
      title="头像"
      is-link
      @click="toEdit('avatarUrl', '头像', user.avatarUrl, '请输入图片的地址')"
    >
      <image
        style="height: 48px; width: 48px; border-radius: 50%"
        :src="user.avatarUrl"
      />
    </up-cell>
    <up-cell
      title="个人介绍"
      is-link
      :value="user.userProfile"
      @click="
        toEdit('userProfile', '个人介绍', user.userProfile, '请输入个人介绍')
      "
    ></up-cell>
    <up-cell
      title="性别"
      is-link
      :value="user.gender != null ? (user.gender == 0 ? '男' : '女') : ''"
      @click="toEdit('gender', '性别', user.gender, '输入 0 为男 1 为女')"
    ></up-cell>
    <up-cell
      title="电话"
      is-link
      :value="user.phone"
      @click="toEdit('phone', '电话', user.phone, '请输入电话号')"
    ></up-cell>
    <up-cell
      title="邮箱"
      is-link
      :value="user.email"
      @click="toEdit('email', '邮箱', user.email, '请输入邮箱')"
    ></up-cell>
    <up-cell title="注册时间" :value="user.createTime"></up-cell>
  </view>
</template>

<script setup>
import { onShow } from '@dcloudio/uni-app'
import { ref } from 'vue'
import { getCurrentUser } from '@/services/user'

const user = ref({})

onShow(async () => {
  try {
    const currentUser = await getCurrentUser()
    user.value = currentUser
    // console.log('用户信息:', user.value)
  } catch (error) {
    console.error('获取用户信息失败:', error)
  }
})

const toEdit = (editKey, editName, currentValue, placeholder) => {
  // console.log(editKey)
  // console.log(editName)
  // console.log(currentValue)
  // console.log(placeholder)
  uni.navigateTo({
    url: `/pages/profile/edit?editKey=${editKey}&editName=${editName}&currentValue=${currentValue}&placeholder=${placeholder}`
  })
}
</script>

<style scoped>
/* 样式兼容 uView 和小程序 */
image {
  display: block;
}
</style>
